//点击现金余额跳转的页面
import React, {Component} from "react";
import {
  View,
  Text,
  Button,
  StyleSheet,
  Image,
  TouchableOpacity,
} from 'react-native';
import ContentAlign from './ContentAlign';
import { StackNavigator,TabNavigator } from 'react-navigation';

const styles = StyleSheet.create({
  container: {
    // flex: 1,
    height:'37%',
  	backgroundColor: '#e4393c',
  },
  doubleButton: {
  	flexDirection:'row',
  	alignItems: 'center',  
  	justifyContent: 'center',
    paddingTop: '5%',
  },
  touch: {
  	width: '50%',
  	alignItems: 'center',      // 水平局中
    justifyContent: 'center',  // 垂直居中
  },
  touchPress: {
  	borderWidth: 1,
  	borderColor: '#fff8dc',
  	borderRadius: 4,
  	alignItems: 'center',      // 水平局中
    justifyContent: 'center',  // 垂直居中
    paddingTop: 5,
    paddingBottom: 5,
    paddingLeft: 18,
    paddingRight: 18,
  },
  touchText: {
  	fontSize: 16,
  	color: '#fff',
  },
   contain: {
    justifyContent: 'center',
    alignItems: 'center',
    marginTop: '3%',
  }
});

class DoubleButton extends React.Component{
	render(){
		return (
			<View style={styles.doubleButton}>
				<TouchableOpacity style={styles.touch} onPress={()=>navigate('yi')}>
				<View style={styles.touchPress}>
					<Text style={styles.touchText}>可提现</Text>
					<Text style={styles.touchText}>0.0</Text>
				</View>	
				</TouchableOpacity>

				<TouchableOpacity style={styles.touch} onPress={()=>navigate('er')}>
					<View style={styles.touchPress}>
						<Text style={styles.touchText}>可使用</Text>
						<Text style={styles.touchText}>0.0</Text>
					</View>
				</TouchableOpacity>
			</View>
		);
	}
}

class CashBalance extends React.Component{
	
	render(){
		return(
    
  			<View style={styles.container}>
  				<ContentAlign />
  				<DoubleButton  {...this.props}/>    
  			</View>

		);
	}
}

export default CashBalance;